<style>
    #show_toolbar span {
        color: green;font-weight: bold;font-size: 22px;
    }
</style>
<form class="layui-form seller-form" action="" method="post">
    <div class="layui-form-item">
        <div class="layui-inline">
            <input type="text" name="username" lay-verify="title" style="width:150px;"
                   class="layui-input" placeholder="Username">
        </div>
        <div class="layui-inline" style="">
            <select name="desc_list" lay-verify="" >
                <option value="">请选择排序属性</option>
                <option value="user_id">用户Id</option>
                <option value="fund_total_credit">充值金额</option>
                <option value="total_amount">统计金额</option>
                <option value="card_balance">用户余额</option>
                <option value="tran_total_amount">消费总额</option>
                <option value="card_balance">卡余额</option>
                <option value="tran_declined_rate">拒付比例</option>
            </select>
        </div>
        <div class="layui-inline" style="padding-left:20px;color: #00b716">
            <button class="layui-btn layui-btn-sm" lay-submit lay-filter="user-search"><i
                    class="iconfont icon-chaxun"></i>Search</button>
            <button class="layui-btn layui-btn-sm" lay-submit lay-filter="user-search-diff"><i
                    class="iconfont icon-chaxun"></i>Search-差异</button>
            <button class="layui-btn layui-btn-sm" lay-submit lay-filter="user_data_update">Update Data</button>
            <span style="font-size: 20px;padding-left: 20px;">
                                Refresh Time : <span id="up_time" style="color: #FF5722">{$time}</span>
                                统计时区 :<span  style="color: #FF5722;padding-left: 30px;">'UTC-5'(北京时间减13小时)</span>
                        </span>
        </div>
    </div>
    <div class="layui-tab">
        <ul class="layui-tab-title">
            <li class="layui-this">用户统计-All</li>
            <li>用户统计-差异</li>
            <li>计算公式</li>
        </ul>
        <div class="layui-tab-content">
            <div class="layui-tab-item layui-show">
                <div class="table-body">
                    <table id="userTable" lay-filter="test"></table>
                </div>
            </div>
            <div class="layui-tab-item">
                <div class="table-body">
                    <table id="userTable2" lay-filter="test"></table>
                </div>
            </div>
            <div class="layui-tab-item">
                <pre class="layui-code">
                // 计算公式:
                    <span style="color:red;font-size: 20px;">银12</span>
                    预扣金额(Auth)          = type=Authorized,flag=N ; 取值amount_auth累加
                    结算金额(Posted)        = type=Posted; 取值amount_post累加
                    退款金额1(Credit)       = type=Credit ， 取值amount_post累加
                    退款金额2(Credit_566766)= type=Credit_566766 ， 取值amount_post累加
                    已审核退款金额           = Credit_ok
                    未审核退款金额           = 退款金额1(Credit) - 已审核退款金额

                    消费总额(银1，2)   = 预扣金额(Auth) + 结算金额(Posted) - 退款金额1(Credit) - 退款金额2(Credit_566766)

                    <span style="color:red;font-size: 20px;">银3</span>
                    预扣金额(Auth)          = type=Authorized,flag=N ; 取值amount_auth累加
                    结算金额(Posted)        = type=Posted; 取值amount_post累加
                    退款金额(Credit)       = type=Credit ， 取值amount_post累加
                    撤销金额(Reversal)      = type=Reversal ， 取值amount_auth累加

                    消费总额(银3)   = 预扣金额(Auth) + 结算金额(Posted) - 退款金额(Credit) - 撤销金额(Reversal)

                    消费总额        =  消费总额(银1，2) + 消费总额(银3)

                    统计总额 = 消费总额 + 用户余额 + 卡余额(总) + 开卡费(总) + 充值服务费(总)
                                + 退款服务费(总) + 未审核退款金额
                                + Comdata(拒付+0验证) + Connexpay(拒付+0验证) + Connexpay(货转服务费)
                </pre>
            </div>
        </div>
    </div>
</form>
<script>
    layui.use(['form', 'table' , 'laydate' , 'element'], function () {

        //时间插件
        layui.laydate.render({
            elem: '#datetime',
            range: '_',
            format: 'yyyy-MM-dd'
        });

        var tableIn = layui.table.render({
            elem: '#userTable',
            height: 'full-130',
            cellMinWidth: '80',
            totalRow: true,
            toolbar: '#toolbar', //开启头部工具栏，并为其绑定左侧模板
            defaultToolbar: ['exports'],
            url: "{:url('user/indexData')}?_ajax=1",
            id: 'userTable',
            cols: [[
                { type: 'numbers'},
                { field: 'username', align: 'left', style:'font-weight:bold;' ,width:180, title: 'UserName'},
                { field: 'fund_total_credit', title: '实充总额', align:"right",width:140,
                    style:'font-weight:bold', totalRow: true,
                    // templet: function (d) {
                    //     const total_amount   = d.total_amount;
                    //     const fund_total    = d.fund_total_credit;
                    //     var   show_color    = 'green';
                    //     if(total_amount - fund_total != 0){
                    //         show_color = '#FF5722';
                    //     }
                    //     return '<font color="'+ show_color +'">' + fund_total + '</font>';
                    // }
                },
                // { field: 'total_amount', title: '统计总额', align:"right",width:130,
                //     style:'font-weight:bold', totalRow: true,
                //     templet: function (d) {
                //         const total_amount   = d.total_amount;
                //         const fund_total    = d.fund_total_credit;
                //         var   show_color    = '';
                //         if(total_amount - fund_total != 0){
                //             show_color = '#FF5722';
                //         }
                //         return '<font color="'+ show_color +'">' + total_amount + '</font>';
                //     }
                // },
                { field: 'total_amount_1', title: '统计总额', align:"right",width:130,
                    style:'font-weight:bold', totalRow: true},
                { field: 'user_balance', title: '用户余额', align:"right",width:130,
                    style:'font-weight:bold', totalRow: true},
                { field: 'card_balance', title: '卡余额', align:"right",width:120,
                    style:'font-weight:bold', totalRow: true},
                { field: 'card_open_amount', title: '开卡费', align:"right",width:120,
                    style:'font-weight:bold;color:#FF5722;', totalRow: true},
                { field: 'card_server_amount', title: '服务费', align:"right",width:120,
                    style:'font-weight:bold;color:#FF5722;', totalRow: true},
                { field: 'card_refund_amount', title: '退款服务费', align:"right",width:120,
                    style:'font-weight:bold;color:#FF5722;', totalRow: true},
                // { field: 'tran_total_amount', title: '消费总额(总)', align:"right",width:120,
                //     style:'font-weight:bold;color:#FF5722;', totalRow: true},
                { field: 'card_tran_amount', title: '消费总额(总)', align:"right",width:150,
                    style:'font-weight:bold;color:#FF5722;', totalRow: true},
                { field: 'tran_qz_amount', title: '卡强消费', align:"right",width:120,
                    style:'font-weight:bold;color:#FF5722;', totalRow: true},
                // { field: 'tran_total_amount_1', title: '消费总额(银12)', align:"right",width:140,
                //     style:'font-weight:bold;color:#1c49e2;', totalRow: true},
                // { field: 'tran_total_amount_3', title: '消费总额(银3)', align:"right",width:120,
                //     style:'font-weight:bold;color:green;', totalRow: true},
                // { field: 'auth', title: 'auth(银12)', align:"right",width:120,
                //     style:'font-weight:bold;color:#00aeef', totalRow: true},
                // { field: 'posted', title: 'post(银12)', align:"right",width:120,
                //     style:'font-weight:bold;color:#00aeef', totalRow: true},
                // { field: 'credit', title: 'credit(银12)', align:"right",width:120,
                //     style:'font-weight:bold;color:#00aeef', totalRow: true},
                // { field: 'credit_ok', title: 'credit_已审核(银12)', align:"right",width:160,
                //     style:'font-weight:bold;color:#00aeef', totalRow: true},
                // { field: 'credit_556766', title: 'credit_556766(银12)', align:"right",width:160,
                //     style:'font-weight:bold;color:#00aeef', totalRow: true},
                // { field: 'reversal', title: 'reversal(银12)', align:"right",width:120,
                //     style:'font-weight:bold;color:#00aeef', totalRow: true},
                // { field: 'decline', title: 'decline(银12)', align:"right",width:120,
                //     style:'font-weight:bold;color:#00aeef', totalRow: true},
                // { field: 'auth_3', title: 'auth(银3)', align:"right",width:120,
                //     style:'font-weight:bold;color:#00b716', totalRow: true},
                // { field: 'posted_3', title: 'post(银3)', align:"right",width:120,
                //     style:'font-weight:bold;color:#00b716', totalRow: true},
                // { field: 'credit_3', title: 'credit(银3)', align:"right",width:120,
                //     style:'font-weight:bold;color:#00b716', totalRow: true},
                // { field: 'reversal_3', title: 'reversal(银3)', align:"right",width:120,
                //     style:'font-weight:bold;color:#00b716', totalRow: true},
                // { field: 'decline_3', title: 'decline(银3)', align:"right",width:120,
                //     style:'font-weight:bold;color:#00b716', totalRow: true},
                { field: 'profit_cd', title: 'Cd(拒付0验证)', align:"right",width:130,
                    style:'font-weight:bold', totalRow: true},
                { field: 'profit_lss', title: 'Lss(拒付0验证)', align:"right",width:130,
                    style:'font-weight:bold', totalRow: true},
                { field: 'profit_hz', title: 'Lss(货转)', align:"right",width:130,
                    style:'font-weight:bold', totalRow: true},
                { field: 'tran_declined_rate', title: '拒付率(%)', align:"right",width:120 ,sort: true},
                { field: 'tran_declined_count', title: '拒付次数', align:"right",width:120 ,sort: true},
                { field: 'tran_declined_amount', title: '拒付金额',
                    style:'font-weight:bold',align:"right",width:120 ,sort: true,totalRow: true},
                { field: 'card_count', title: '已开卡', align:"right",width:100, totalRow: true},
                { field: 'cancel_card_count', title: '卡注销', align:"right",width:100, totalRow: true},
                { field: 'card_tran_rate', title: '累计消费/开卡数量', align:"right",width:200,
                    style:'font-weight:bold', totalRow: true},
            ]],
            page: true,
            limit: 100,
            limits: [100, 1000,5000],
        });

        var tableIn2 = layui.table.render({
            elem: '#userTable2',
            height: 'full-130',
            cellMinWidth: '80',
            totalRow: true,
            toolbar: '#toolbar', //开启头部工具栏，并为其绑定左侧模板
            defaultToolbar: ['exports'],
            url: "{:url('user/indexData2')}?_ajax=1",
            id: 'userTable2',
            cols: [[
                { type: 'numbers'},
                { field: 'user_id', align: 'left' ,width:100, title: 'UserId'},
                { field: 'username', align: 'left', style:'font-weight:bold;' ,width:300, title: 'User Name'},
                { field: 'fund_total', title: '实际充值总额($)', align:"right",width:300,
                    style:'font-weight:bold', totalRow: true,sort: true,
                    // templet: function (d) {
                    //     const total_amount   = d.total_amount;
                    //     const fund_total    = d.fund_total;
                    //     var   show_color    = '';
                    //     if(total_amount - fund_total >0){
                    //         show_color = '#FF5722';
                    //     }
                    //     return '<font color="'+ show_color +'">' + fund_total + '</font>';
                    // }
                },
                // { field: 'total_amount', title: '统计总额($)', align:"right",width:300,
                //     style:'font-weight:bold', totalRow: true,sort: true,
                //     // templet: function (d) {
                //     //     const total_amount   = d.total_amount;
                //     //     const fund_total    = d.fund_total;
                //     //     var   show_color    = '';
                //     //     if(total_amount - fund_total >0){
                //     //         show_color = '#FF5722';
                //     //     }
                //     //     return '<font color="'+ show_color +'">' + total_amount + '</font>';
                //     // }
                // },
                { field: 'total_amount_1', title: '统计总额($)', align:"right",width:300,
                    style:'font-weight:bold', totalRow: true,sort: true,
                    // templet: function (d) {
                    //     const total_amount   = d.total_amount;
                    //     const fund_total    = d.fund_total;
                    //     var   show_color    = '';
                    //     if(total_amount - fund_total >0){
                    //         show_color = '#FF5722';
                    //     }
                    //     return '<font color="'+ show_color +'">' + total_amount + '</font>';
                    // }
                },
                { field: 'diff_amount', title: '差值', align:"right",width:200,
                    style:'font-weight:bold', totalRow: true,
                    templet: function (d) {
                        const diff_amount   = d.diff_amount;
                        var   show_color    = '';
                        if(diff_amount < 0){
                            show_color = '#FF5722';
                        }else{
                            show_color = 'green';
                        }
                        return '<font color="'+ show_color +'">' + diff_amount + '</font>';
                    }
                },
            ]],
            page: true,
            limit: 100,
            limits: [100, 1000 , 5000],
        });
        //搜索
        layui.form.on('submit(user-search)', function (data) {
            layui.table.reload('userTable', {
                where: data.field
                , page: {
                    curr: 1 //重新从第 1 页开始
                },
                method:'POST'
            });
            tableIn2.reload({
                where: data.field,
                page:{
                    curr :1
                }
            });
            return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
        });

        layui.form.on('submit(user_data_update)', function () {
            var loading =layer.load(1, {shade: [0.1,'#fff']});
            JsPost("{:url('user/userDataUp')}",'', function(res){
                layer.close(loading);
                if(res.code >0){
                    $('#up_time').text(res.data.time);
//                    $('#tran_amount').text(res.data.tran_amount);
//                    $('#available_balance').text(res.data.available_balance);
//                    $('#sum_amount').text(res.data.sum_amount);
//                    $('#total_deposit').text(res.data.total_deposit);
//                    $('#diff_amount').text(res.data.diff_amount);
                    layer.msg(res.msg, { time: 1500 , icon:1}, function () {
                        tableIn.reload({
                            page:{
                                curr :1
                            }
                        });
                        tableIn2.reload({
                            page:{
                                curr :1
                            }
                        });
                    });
                }else{
                    layer.msg(res.msg , {time:1500 , icon:2});
                }
            })
            return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
        });
    });
</script>